import 'babel-polyfill'
import React from 'react'
import ReactDOM from 'react-dom'
import { Router } from 'react-router'
import { Provider } from 'react-redux'
import { createStore, applyMiddleware } from 'redux'
import { createLogger } from 'redux-logger'
import routes from './routes'
import reducer from './reducers'
import thunk from 'redux-thunk'
import { syncHistoryWithStore } from 'react-router-redux'
import myhistory from './history'
import api from './middleware/api'
import ajaxres from './middleware/ajaxres'
import wxapi from './middleware/wxapi'
import wxajaxres from './middleware/wxajaxres'

const middleware = [ thunk,api,ajaxres,wxapi,wxajaxres ]
if (process.env.NODE_ENV !== 'production') {
  middleware.push(createLogger())
}

/*
import { createStore, applyMiddleware, compose } from 'redux'
import thunk from 'redux-thunk'
import { createLogger } from 'redux-logger'
import api from '../middleware/api'
import rootReducer from '../reducers'
import DevTools from '../containers/DevTools'

const configureStore = preloadedState => {
  const store = createStore(
    rootReducer,
    preloadedState,
    compose(
      applyMiddleware(thunk, api, createLogger()),
      DevTools.instrument()
    )
  )

  if (module.hot) {
    // Enable Webpack hot module replacement for reducers
    module.hot.accept('../reducers', () => {
      const nextRootReducer = require('../reducers').default
      store.replaceReducer(nextRootReducer)
    })
  }

  return store
}

export default configureStore
*/

const store = createStore(
  reducer,
  applyMiddleware(...middleware)
)

const history = syncHistoryWithStore(myhistory, store)

ReactDOM.render(
  <Provider store={store}>
   <Router history={myhistory} >
        { routes }
    </Router>
  </Provider>,
  document.getElementById('root')
);